<template>
	<view>
		<view v-for="(item,i) in devicesList" :key="i" class="cu-list menu card-menu margin-top sm-border borders">
			<view class="cu-item bg-white arrow" @tap="jumpBuy(item)">
				<view class="content line-limit-one">
					<image :src="`https://statics.xmcsrv.net/weixin/cloud/device/type/${item.devState ? item.icon+'-1' :item.icon }.svg`" style="padding:3px;width:78upx;" mode="widthFix"></image>
					<text class="text-df text-black">{{item.devName}}</text>
				</view>
			</view>
			<!-- 云存储 -->
			<xmcCss v-if="item['xmc.css']&&item['xmc.css']['xmc.css.pic.support']" :message="item['xmc.css']"></xmcCss>
             <!--&lt;!&ndash; 流量 &ndash;&gt;-->
			<netCellular v-if="item['net.cellular']&&item['net.cellular']['net.cellular.support']" :message="item['net.cellular']"></netCellular>
              <!--&lt;!&ndash; 云电话 &ndash;&gt;-->
			<xmcVoes v-if="item['xmc.voes']&&item['xmc.voes']['xmc.voes.support']" :message="item['xmc.voes']"></xmcVoes>
            <!--&lt;!&ndash; 语音报警 &ndash;&gt;-->
			<pmsVoes v-if="item['pms.voes']&&item['pms.voes']['pms.voes.support']" :message="item['pms.voes']"></pmsVoes>
            <!--&lt;!&ndash; 短信报警 &ndash;&gt;-->
			<pmsSms v-if="item['pms.sms']&&item['pms.sms']['pms.sms.support']" :message="item['pms.sms']"></pmsSms>
		</view>
	</view>
</template>

<script>
import xmcCss from '../xmcCss/xmcCss'
import xmcVoes from '../xmcVoes/xmcVoes'
import pmsVoes from '../pmsVoes/pmsVoes'
import pmsSms from '../pmsSms/pmsSms'
import netCellular from '../netCellular/netCellular'
export default {
	components: {
	    xmcCss,
		netCellular,
        xmcVoes,
		pmsVoes,
		pmsSms,
		
	},
	props:{
		devicesList:{
			type:Array,
			default:()=>[]
		}
	},
	data() {
		return {
		}
	},
    methods: {
		// 跳转到设备
		jumpBuy (item){
			const {devId} = item;
			let classifyId_sel;//根据支持的商品判断跳转
			let message = {
				isChannel:false,//是否多通道
				mes:{}
			}
			if(item['xmc.css']['xmc.css.vid.support']){
				classifyId_sel = 'xmc.css';
				if(item['xmc.css'].channelsArr.length){
					const {channelsArr,normalUseChannel} = item['xmc.css'];
					message = {
						isChannel:true,//是否多通道
						mes:{
							channelsArr,
							'xmc.css.maxchannel':item['xmc.css']['xmc.css.maxchannel'],
							normalUseChannel
						}
					}
				}
			}else if(item['net.cellular']['net.cellular.support']){
				classifyId_sel = 'net.cellular'
			}else if(item['xmc.voes']['xmc.voes.support']){
				classifyId_sel ='xmc.voes'
			}else if(item['pms.voes']['pms.voes.support']){
				classifyId_sel ='pms.voes'
			}else if(item['pms.sms']['pms.sms.support']){
				classifyId_sel ='pms.sms'
			}
			if(!message.isChannel){
				this.$routing(`${this.$pages.buyDefault}?classifyId=${classifyId_sel}&sn=${devId}`)
			}else{
				this.$routing(`${this.$pages.channels}?classifyId=${classifyId_sel}&sn=${devId}&deviceMessage=${JSON.stringify(message.mes)}`)
			}
		},
    }
}
</script>

<style lang="less" scoped>
@import '@/common/style/main.css';
.height {
	height: 1.2rem;
}
.action .cu-btn {
    padding: 6upx 40upx !important;
}

</style>
